import {
	TypeDragDir
} from '../define/dir-drag.js';
import {
	hFlexPoint
} from './flex-point.js';
/**
 * @param {Object} dom dom
 * @param {Object} t top
 * @param {Object} l left
 * @param {Object} w width
 * @param {Object} h height
 */
function hSetDomTLWH(dom, t, l, w, h) {
	dom.style.setProperty('top', `${t}px`);
	dom.style.setProperty('left', `${l}px`);
	dom.style.setProperty('width', `${w}px`);
	dom.style.setProperty('height', `${h}px`);
}
/**目标fdom的位置与大小给当前dom
 * @param {Object} dom  当前
 * @param {Object} fdom  目标
 */
function SetDomTransByFdom(dom, fdom) {
	if (!fdom || !dom || fdom.style.display == 'none') {
		return;
	}
	let h = fdom.clientHeight,
		w = fdom.clientWidth,
		l = fdom.offsetLeft,
		t = fdom.offsetTop;
	//console.log("重置大小", dom, fdom, h, w, l, t);
	hSetDomTLWH(dom, t, l, w, h);
}
const hBoxTool = (dir, dom) => {

	let _dom = dom;
	let _dir;
	let _fact = 20; //对齐像素20px
	function hFlexV(v2) {
		let v = Math.abs(v2);
		let oy = v % _fact;
		if (oy != 0) {
			if (oy > 10) {
				v += _fact - oy;
			} else {
				v -= oy;
			}
		}
		return v2 > 0 ? v : v * -1;
	}

	function hFlex() {
		let h = hFlexV(dom.clientHeight),
			w = hFlexV(dom.clientWidth),
			l = hFlexV(dom.offsetLeft),
			t = hFlexV(dom.offsetTop);
		hSetDomTLWH(dom, t, l, w, h);
	}

	function hSetDir(dir) {
		_dir = dir;
		if (dir == '') {
			document.removeEventListener('mousemove', hMouseMove);
			hFlex();
			bcall?.(dom);
		} else {
			document.addEventListener('mousemove', hMouseMove);
		}
	}

	function hMove(ex, ey) {
		hMTop(ey);
		hMLeft(ex);
		return;
		let y = dom.offsetTop + ey,
			x = dom.offsetLeft + ex;
		let p = hFlexPoint(x, y);
		x = p.x;
		y = p.y;
		//p.x += e.movementX;
		//p.y += e.movementY;
		//rfBox.value.style = `transform:translate(${p.x}px,${p.y}px);`; 
		//dom.style= `top:${y}px;left:${x}px;`; 
	}

	function hMTop(v) {
		v += dom.offsetTop;
		if (v <= 0) {
			v = 0;
		}
		dom.style.setProperty('top', `${v}px`);
		return v;
	}

	function hMLeft(v) {
		v += dom.offsetLeft;
		if (v <= 0) {
			v = 0;
		}
		dom.style.setProperty('left', `${v}px`);
		return v;
	}

	function hAddHeight(v) {
		v += dom.clientHeight;
		if (v <= 30) {
			v = 30;
		}
		dom.style.setProperty('height', `${v}px`);
	}

	function hAddWidth(v) {
		let w = dom.clientWidth + v;
		if (w <= 30) {
			w = 30;
		}
		dom.style.setProperty('width', `${w}px`);
	}


	const hMouseMove = (e) => {
		if (e.buttons == 0) {
			hSetDir('');
			return;
		}
		let ex = e.movementX,
			ey = e.movementY;

		switch (dir) {
			case TypeDragDir.CENTER:
				hMove(ex, ey);
				break;
			case TypeDragDir.TOP:
				if (hMTop(ey) != 0) {
					hAddHeight(-ey);
				};
				break;
			case TypeDragDir.BOTTOM:
				hAddHeight(ey);
				break;
			case TypeDragDir.RIGHT:
				hAddWidth(ex);
				break;
			case TypeDragDir.LEFT:
				if (hMLeft(ex)) {
					hAddWidth(-ex);
				}
				break;

			case TypeDragDir.BR:
				hAddHeight(ey);
				hAddWidth(ex);
				break;

			case TypeDragDir.BL:
				if (hMLeft(ex)) {
					hAddWidth(-ex);
				};
				hAddHeight(ey);
				break;
			case TypeDragDir.TR:
				if (hMTop(ey) != 0) {
					hAddHeight(-ey);
				};
				hAddWidth(ex);
				break;
			case TypeDragDir.TL:
				if (hMTop(ey) != 0) {
					hAddHeight(-ey);
				};
				if (hMLeft(ex)) {
					hAddWidth(-ex);
				}
				break;
			default:
				break;
		}
		callChange?.(_dom);
	}

	hSetDir(dir);
	const OnChange = (b) => {
		callChange = b;
		return _this;
	}
	const OnDone = (b) => {
		bcall = b;
		return _this;
	};
	let bcall, callChange;

	let _this = {
		OnDone,
		OnChange
	}

	return _this;
};



const hSetDom = (dom, changBack, changDone) => {
	let _dir, _fact = 20, //对齐像素20px
		_change = changBack,
		_done = changDone;


	function hFlexV(v2) {
		let v = Math.abs(v2);
		let oy = v % _fact;
		if (oy != 0) {
			if (oy > 10) {
				v += _fact - oy;
			} else {
				v -= oy;
			}
		}
		return v2 > 0 ? v : v * -1;
	}

	function hFlex() {
		let h = hFlexV(dom.clientHeight),
			w = hFlexV(dom.clientWidth),
			l = hFlexV(dom.offsetLeft),
			t = hFlexV(dom.offsetTop);
		hSetDomTLWH(dom, t, l, w, h);
	}

	function hSetDir(dir) {
		_dir = dir;
		//console.log("方向",dir);
		if (!dir) {
			document.removeEventListener('mousemove', hMouseMove);

			hFlex();
			let r = {
				t: dom.offsetTop,
				l: dom.offsetLeft,
				w: dom.clientWidth,
				h: dom.clientHeight
			}
			_change?.(r);
			_done?.(r);
		} else {
			document.addEventListener('mousemove', hMouseMove);
		}
	}

	function hMove(ex, ey) {
		hMTop(ey);
		hMLeft(ex);
	}

	function hMTop(v) {
		v += dom.offsetTop;
		if (v <= 0) {
			v = 0;
		}
		dom.style.setProperty('top', `${v}px`);
		return v;
	}

	function hMLeft(v) {
		v += dom.offsetLeft;
		if (v <= 0) {
			v = 0;
		}
		dom.style.setProperty('left', `${v}px`);
		return v;
	}

	function hAddHeight(v) {
		v += dom.clientHeight;
		if (v <= 30) {
			v = 30;
		}
		dom.style.setProperty('height', `${v}px`);
	}

	function hAddWidth(v) {
		let w = dom.clientWidth + v;
		if (w <= 30) {
			w = 30;
		}

		dom.style.setProperty('width', `${w}px`);
	}


	const hMouseMove = (e) => {
		if (e.buttons == 0) {
			hSetDir();
			return;
		}
		let ex = e.movementX,
			ey = e.movementY;

		switch (_dir) {
			case TypeDragDir.CENTER:
				hMove(ex, ey);
				break;
			case TypeDragDir.TOP:
				if (hMTop(ey) != 0) {
					hAddHeight(-ey);
				};
				break;
			case TypeDragDir.BOTTOM:
				hAddHeight(ey);
				break;
			case TypeDragDir.RIGHT:
				hAddWidth(ex);
				break;
			case TypeDragDir.LEFT:
				if (hMLeft(ex)) {
					hAddWidth(-ex);
				}
				break;

			case TypeDragDir.BR:
				hAddHeight(ey);
				hAddWidth(ex);
				break;

			case TypeDragDir.BL:
				if (hMLeft(ex)) {
					hAddWidth(-ex);
				};
				hAddHeight(ey);
				break;
			case TypeDragDir.TR:
				if (hMTop(ey) != 0) {
					hAddHeight(-ey);
				};
				hAddWidth(ex);
				break;
			case TypeDragDir.TL:
				if (hMTop(ey) != 0) {
					hAddHeight(-ey);
				};
				if (hMLeft(ex)) {
					hAddWidth(-ex);
				}
				break;
			default:
				break;
		}
		_change?.({
			t: dom.offsetTop,
			l: dom.offsetLeft,
			w: dom.clientWidth,
			h: dom.clientHeight
		});
	}


	return {
		hSetDir,
	}
}
//hBoxTool(d, rfBox.value).OnChange(hOnChange).OnDone(hOnChangeDone);
export {
	hSetDom,
	hBoxTool,
	hSetDomTLWH,
	SetDomTransByFdom
};
